<template>
	<div class="front" v-drag>
		<div class="tree-left bg-white">
			<div class="tit">单据列表</div>
			<el-tree :data="treeData" ref="tree" accordion :expand-on-click-node="false" :props="defaultProps" highlight-current @node-click="nodeClick" @node-expand="nodeExpand"></el-tree>
		</div>
		<div class="tree-right bg-white">
			<v-menu/>
			<div class="table">
				<v-table/>
			</div>
		</div>
	</div>
</template>
<script>
import menu from './menu'
import table from './table5'
export default {
	components: {
		'v-menu': menu,
		'v-table': table
	},
	data() {
		return {
			treeData: [],
			defaultProps: {
				label: 'name',
				children: 'children'
			},
			status: this.$store.state.verifyProcessStore.status
		}
	},
	watch: {
		status(newVal) {
			if(newVal[0] === '5') {
				let store = this.$store.state.verifyProcessStore,
					treeData = store.treeData;
				// this.$nextTick(() => this.$refs.tree.setCurrentNode(treeData[0]));		//默认选中第一个
				treeData.forEach(rootItem => {
                    rootItem['children'].forEach(vercharItem => {
                        if(vercharItem['subList'].length > 0) {
                            if(vercharItem['children'].length > 0) vercharItem['children'].splice(0);
                            vercharItem['subList'].forEach(dpItem => {
                                vercharItem['children'].push(dpItem);
                                if(dpItem['subList'].length > 0) {
                                    dpItem['children'].splice(0);
                                    dpItem['subList'].forEach(empItem => {
                                        dpItem['children'].push(empItem);
                                        if(empItem['subList'].length > 0) {
                                            empItem['children'].splice(0);
                                            empItem['subList'].forEach(mnItem => {
                                                if(mnItem['children'].length > 0) mnItem['children'].splice(0);
                                                empItem['children'].push(mnItem);
                                            });
                                        }
                                    });
                                }
                            });
                        }
                    });
                });
				this.treeData = [].concat(treeData);
			}
		}
	},
	methods: {
		nodeClick(row) {
			if(row['level'] === 4) {
				this.$store.commit('verifyProcessStore/updateReviewerTableData', row['subList']);
				this.$store.commit('verifyProcessStore/updateIsAdd', true);			//如果点击的是职员节点，允许新增
				this.$store.commit('verifyProcessStore/updateTreeNode', row);		//保存当前操作的节点
				this.$store.commit('verifyProcessStore/updateVercharId', row['vercharId']);		//保存会计科目id
				this.$store.commit('verifyProcessStore/updateDeptId', row['deptId']);		//保存部门id
				this.$store.commit('verifyProcessStore/updateEmpId', row['pid']);	//保存职员id
				this.$store.commit('verifyProcessStore/updateMoneyId', row['id']);	//保存金额id
				this.$store.commit('verifyProcessStore/updateAmounts', String(row['money1']) + ',' + String(row['money2']));
			} else {
				this.$store.commit('verifyProcessStore/updateReviewerTableData', []);
				this.$store.commit('verifyProcessStore/updateIsAdd', false);
				this.$store.commit('verifyProcessStore/updateTreeNode');		//删除当前操作的节点
				this.$store.commit('verifyProcessStore/updateVercharId');		//删除会计科目id
				this.$store.commit('verifyProcessStore/updateDeptId');			//删除部门id
				this.$store.commit('verifyProcessStore/updateEmpId');			//删除职员id
				this.$store.commit('verifyProcessStore/updateMoneyId');			//删除金额id
				this.$store.commit('verifyProcessStore/updateAmounts');
			}
		},
		nodeExpand(row) {		//节点被展开时触发
			this.$store.commit('verifyProcessStore/updateIsAdd', false);
			switch(row['level']) {
				case 0:
					this.$store.commit('verifyProcessStore/updateBillId', row['id']);		//保存单据id
					break;
				default: break;
			}
		}
	}
}
</script>